<!DOCTYPE html>
<html>
<head>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
  <link rel="stylesheet" type="text/css" href="/static/layui/css/layui.css" media="all">
  <script type="text/javascript" src="/static/layui/layui.js"></script>
  <style type="text/css">
    .header span{background:#009688;margin-left:30px;padding:10px;color:#ffffff;}
    .header div{border-bottom:solid 2px #009688;margin-top: 8px;}
    .header button{float:right;margin-top:-5px;}
  </style>
</head>
<body style="padding:10px; box-sizing: border-box;">
<form class="layui-form">
  <div class="layui-form-item" style="display:none;">
    <label class="layui-form-label">id</label>
    <div class="layui-input-inline">
      <input type="text" class="layui-input" name="id" value="{$finds['id']}">
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">分类</label>
    <div class="layui-input-inline">
      <select name="class" lay-verify="required">
        <option value="">请选择分类</option>
        {foreach($lists as $lists_v)}
        {if($finds['class']==$lists_v['id'])}
        <option value="{$lists_v['id']}" selected>{if($lists_v['parent_id']!=0)}&nbsp;&nbsp;&nbsp;&nbsp;{/if}{$lists_v['title']}</option>
        {else/}
        <option value="{$lists_v['id']}">{if($lists_v['parent_id']!=0)}&nbsp;&nbsp;&nbsp;&nbsp;{/if}{$lists_v['title']}</option>
        {/if}
        {/foreach}
      </select>
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">地址</label>
    <div class="layui-input-inline">
      <input type="text" class="layui-input" name="url" value="{$finds['url']}">
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">导航名</label>
    <div class="layui-input-block" style="position: relative; padding-right: 65px;">
      <input type="text" class="layui-input" name="title" value="{$finds['title']}">
      <button type="button" class="layui-btn layui-btn-sm" id="readBtn" style="position: absolute; right: 0; top: 0; height: 38px; width: 60px;">读取</button>
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">介绍</label>
    <div class="layui-input-inline">
      <input type="text" class="layui-input" name="mtitle" value="{$finds['mtitle']}">
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">图标</label>
    <div class="layui-input-inline">
      <input type="text" class="layui-input" name="icon" value="{$finds['icon']}">
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">排序</label>
    <div class="layui-input-inline">
      <input type="text" class="layui-input" name="sort" value="{$finds['sort']}">
    </div>
  </div>

  <div class="layui-form-item">
    <label class="layui-form-label">显示</label>
    <div class="layui-input-block">
      {if($finds['show']==0)}
      <input type="checkbox" name="show" value=0 lay-skin="switch" lay-text="显示|隐藏" checked>
      {else/}
      <input type="checkbox" name="show" value=0 lay-skin="switch" lay-text="显示|隐藏">
      {/if}
    </div>
  </div>
</form>
<div class="layui-form-item">
  <div class="layui-input-block">
    <button type="button" class="layui-btn" onclick="save()">修改</button>
  </div>
</div>
<script type="text/javascript">
  layui.use(['form'],function(){
    form = layui.form;
    $ = layui.jquery;
    
    // 添加读取按钮的点击事件
    $('#readBtn').on('click', function(){
      var url = $('input[name="url"]').val();
      if(url == ''){
        layer.msg('请先输入网址', {"icon":2});
        return false;
      }
      
      layer.msg('正在读取网站信息...', {icon: 16, time: 0});
      $.getJSON(
        "/ico/get.php?read=1&url=" + encodeURIComponent(url),
        function(res){
          layer.closeAll();
          if(res && res.title){
            // 使用正则表达式检测标题中的特殊符号
            // 匹配常见的分隔符：- _ | — – : ： / \ 等以及其他可能的标点符号
            var regex = /[-_|—–:：\/\\,，;；\s]+/;
            var match = res.title.match(regex);
            
            if(match && match.index > 0){
              // 找到特殊符号，分割标题
              var splitPos = match.index;
              var splitChar = match[0];
              var navTitle = res.title.substring(0, splitPos).trim();
              var navDesc = res.title.substring(splitPos + splitChar.length).trim();
              
              // 如果分割后的标题或描述为空，则使用完整标题作为导航名
              if(navTitle === '' || navDesc === ''){
                $('input[name="title"]').val(res.title);
              } else {
                $('input[name="title"]').val(navTitle);
                $('input[name="mtitle"]').val(navDesc);
              }
            } else {
              // 没有找到特殊符号，全部填入导航名
              $('input[name="title"]').val(res.title);
            }
            
            // 显示标题
            layer.msg(res.title, {"icon":1});
            
            // 如果有图标URL，填入图标字段
            if(res.icon_url){
              $('input[name="icon"]').val(res.icon_url);
            }
          } else {
            layer.msg('标题为空', {"icon":2});
          }
        }
      ).fail(function(){
        layer.closeAll();
        layer.msg('标题为空', {"icon":2});
      });
    });
  });
  function save(){
    $.post(
            "/admin/daohangdit",
            $('form').serialize(),//序列化表单
            function(res){
              console.log(res);
              if (res.code==0) {
                layer.msg(res.msg,{"icon":1});
                setTimeout(function () {
                  parent.window.location.reload();
                },1000)
              } else {
                layer.msg(res.msg,{"icon":2});
              }
            }, "json");
  }
</script>
</body>
</html>